<!-- 仓库表单对话框 -->
<div class="dialog-overlay" *ngIf="visible">
  <div class="dialog-container">
    <div class="dialog-header">
      <h2>{{ isEdit ? '修改仓库' : '新增仓库' }}</h2>
      <button class="close-button" (click)="onCancel()">×</button>
    </div>

    <form [formGroup]="formGroup" (ngSubmit)="onSubmit()">
      <div class="dialog-body">
        <!-- 仓库基本信息 -->
        <div class="form-section" formGroupName="storehouse">
          <h3>基本信息</h3>
          <div class="form-grid">
            <div class="form-group">
              <label for="warehouseCode" class="required">仓库编号</label>
              <div class="input-group">
                <input
                  type="text"
                  class="form-control"
                  id="warehouseCode"
                  formControlName="warehouseCode"
                  [readonly]="isEdit"
                  [attr.disabled]="isEdit"
                />
                <div class="input-group-append" *ngIf="!isEdit">
                  <div class="input-group-text">
                    <input
                      type="checkbox"
                      [(ngModel)]="defaultCode"
                      [ngModelOptions]="{standalone: true}"
                      (change)="onDefaultCodeChange()"
                    />
                    <span class="ms-2">默认编号</span>
                  </div>
                </div>
              </div>
            </div>

            <div class="form-group">
              <label>仓库名称 <span class="required">*</span></label>
              <input type="text" formControlName="warehouseName">
            </div>

            <div class="form-group">
              <label>仓库容量</label>
              <input type="number" formControlName="warehouseCapacity">
            </div>

            <div class="form-group">
              <label>仓库地址</label>
              <input type="text" formControlName="warehouseAddress">
            </div>

            <div class="form-group">
              <label>库管部门</label>
              <input type="text" formControlName="managementDept">
            </div>

            <div class="form-group">
              <label>仓库主管：</label>
              <div class="input-group">
                <input type="text" 
                       [formControl]="formGroup.get('storehouse.warehouseManager')"
                       readonly
                       placeholder="请选择仓库主管">
                <button type="button" class="btn-select" (click)="showManagerSelect()">
                  <i class="fas fa-user"></i>
                </button>
              </div>
            </div>

            <div class="form-group">
              <label>联系电话</label>
              <input type="text" formControlName="phone">
            </div>

            <div class="form-group">
              <label>排序</label>
              <input type="number" formControlName="sort">
            </div>

            <div class="form-group">
              <label>仓库状态</label>
              <select formControlName="warehouseStatus">
                <option value="启用">启用</option>
                <option value="停用">停用</option>
                <option value="锁定">锁定</option>
              </select>
            </div>

            <div class="form-group full-width">
              <label>备注</label>
              <textarea formControlName="remarks" rows="3"></textarea>
            </div>
          </div>
        </div>

        <!-- 库位信息 -->
        <div class="form-section">
          <div class="section-header">
            <h3>库位信息</h3>
            <button type="button" class="btn-add" (click)="addLocation()">
              <i class="fas fa-plus"></i>
              添加库位
            </button>
          </div>

          <div class="locations-table" formArrayName="locations">
            <table>
              <thead>
                <tr>
                  <th>序号</th>
                  <th>库位编号 <span class="required">*</span></th>
                  <th>库位名称 <span class="required">*</span></th>
                  <th>容量</th>
                  <th>负责人</th>
                  <th>状态</th>
                  <th>排序</th>
                  <th>备注</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let location of locationArray.controls; let i = index" [formGroupName]="i">
                  <td>{{i + 1}}</td>
                  <td><input type="text" formControlName="locationId"></td>
                  <td><input type="text" formControlName="locationName"></td>
                  <td><input type="number" formControlName="capacity"></td>
                  <td><input type="text" formControlName="supervisor"></td>
                  <td>
                    <select formControlName="status">
                      <option [ngValue]="0">启用</option>
                      <option [ngValue]="1">停用</option>
                    </select>
                  </td>
                  <td><input type="number" formControlName="sortOrder"></td>
                  <td><input type="text" formControlName="remarks"></td>
                  <td>
                    <button type="button" class="btn-delete" (click)="removeLocation(i)">
                      <i class="fas fa-trash"></i>
                    </button>
                  </td>
                </tr>
                <tr *ngIf="locationArray.length === 0">
                  <td colspan="9" class="text-center">暂无数据</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>

      <div class="dialog-footer">
        <button type="button" class="btn-cancel" (click)="onCancel()">取消</button>
        <button type="submit" class="btn-submit" [disabled]="!formGroup.valid">
          {{ isEdit ? '保存修改' : '确认添加' }}
        </button>
      </div>
    </form>
  </div>
</div>

<!-- 添加选择对话框组件 -->
<app-manager-select-dialog
  [visible]="showManagerDialog"
  [selectedManager]="formGroup.get('storehouse.warehouseManager')?.value"
  (cancel)="onManagerSelectCancel()"
  (confirm)="onManagerSelectConfirm($event)">
</app-manager-select-dialog>

<style>
.input-group {
  display: flex;
  align-items: center;
}

.input-group input {
  flex: 1;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-select {
  padding: 8px 12px;
  background: #fff;
  border: 1px solid #ddd;
  border-left: none;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
}

.btn-select:hover {
  background: #f5f5f5;
}
</style> 